import React, {Component} from 'react';
import Item from '../comment-item/comment-item';
import PropTypes from 'prop-types';
import './comment_list.css'

class CommentList extends Component {
    //给组件类指定属性
    static propTypes={
        comments:PropTypes.array.isRequired,
        delInfo:PropTypes.func.isRequired
    }

    render() {
        const {comments,delInfo}=this.props;
        const display=comments.length===0?'block':'none';
        console.log(comments)
        return (
            <div className="col-md-8">
                <h3 className="reply">评论回复：</h3>
                <h2 style={{display}}>暂无评论，点击左侧添加评论！！！</h2>
                <ul className="list-group">
                    {
                        comments.map((value,index)=><Item comment={value} key={index} delInfo={delInfo} index={index}/>)
                    }
                </ul>
            </div>
        );
    }
}

// CommentList.propTypes = {
//     comments: PropType.array.isRequired
// }

export default CommentList;